<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>个人中心</title>
    <link rel="stylesheet" href="./static/css/global.css">
    <link rel="stylesheet" href="./static/css/myCoupon.css">
    <script src="./static/js/layui.js" charset="utf-8"></script>
    <link rel="stylesheet" href="./static/js/css/layui.css" media="all">
    <script src="./static/js/global/jquery-3.2.1.min.js" charset="utf-8"></script>
</head>

<body>
    <div class="global-title">
        <div>
            <!-- <span class="title-left">嗨，欢迎来贝链嗨购</span> -->
            <div class="title-left-login">
                <span>嗨，欢迎来贝链嗨购</span>
                <div class="title-left-login-user">
                    <img src="./static/img/img1.png" alt="">
                    <span>这里是用户昵称</span>
                </div>
                <a href="./mine.html">个人中心</a>
                <a href="">收藏夹</a>
                <a href="">退出账户</a>
            </div>
            <div class="title-right">
                <a href="/shopLogin.html">供应商登录</a>
                <a href="./help.html">帮助中心</a>
            </div>
        </div>
    </div>
    <div class="global-header">
        <a href="./index.html" class="header-left">
            <img src="./static/img/header_logo.png" alt="">
            <span>个人中心</span>
        </a>
    </div>
    <div class="global-mine-title">
        <a href="">首页></a>
        <span>个人中心</span>
    </div>
    <div class="global-mine-cont">
        <div class="global-mine-menu">
            <a href="./mine.html" class="global-mine-menu-list ">
                个人主页
            </a>
            <a href="./userInfo.html" class="global-mine-menu-list">
                基本资料
            </a>
            <a href="./myCart.html" class="global-mine-menu-list">
                我的购物车
            </a>
            <a href="./myOrder.html" class="global-mine-menu-list">
                我的订单
            </a>
            <a href="./myCoupon.html" class="global-mine-menu-list global-mine-menu-list-this">
                我的优惠券
            </a>
            <a href="./myCollect.html" class="global-mine-menu-list">
                我的收藏
            </a>
            <a href="./myNews.html" class="global-mine-menu-list">
                消息
                <span>111</span>
            </a>
            <a href="./myBill.html" class="global-mine-menu-list">
                我的发票
            </a>
            <a href="./myPassword.html" class="global-mine-menu-list">
                修改密码
            </a>
            <a href="javascript:;" id="service" class="global-mine-menu-list">
                联系客服
            </a>
        </div>
        <div class="global-mine-cont-right">
            <div class="global-mine-cont-title">
                <div class="global-mine-cont-title-left">
                    我的优惠券
                </div>
            </div>
            <div class="coupon-cont">
                <div class="coupon-list">
                    <img src="./static/img/mine_coupon_back1.png" alt="">
                    <div>
                        <div>
                            ￥<span>300</span>
                        </div>
                        <div>
                            <p>使用条件：满1000</p>
                            <p>优惠券类型：单商品</p>
                            <p>有效时间：2019-07-11 -- 2019-07-11</p>
                            <div>
                                <a href="">发行店铺：掌上好掌上好掌上好掌上好</a>
                                <div>
                                    <img src="./static/img/mine_coupon_del.png" alt="">
                                    <span>删除</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="coupon-list">
                    <img src="./static/img/mine_coupon_back2.png" alt="">
                    <div>
                        <div>
                            ￥<span>300</span>
                        </div>
                        <div>
                            <p>使用条件：满1000</p>
                            <p>优惠券类型：单商品</p>
                            <p>有效时间：2019-07-11 -- 2019-07-11</p>
                            <div>
                                <a href="">发行店铺：掌上好掌上好掌上好掌上好</a>
                                <div>
                                    <img src="./static/img/mine_coupon_del.png" alt="">
                                    <span>删除</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="coupon-list">
                    <img src="./static/img/mine_coupon_back3.png" alt="">
                    <div>
                        <div>
                            ￥<span>300</span>
                        </div>
                        <div>
                            <p>使用条件：满1000</p>
                            <p>优惠券类型：单商品</p>
                            <p>有效时间：2019-07-11 -- 2019-07-11</p>
                            <div>
                                <a href="">发行店铺：掌上好掌上好掌上好掌上好</a>
                                <div>
                                    <img src="./static/img/mine_coupon_del.png" alt="">
                                    <span>删除</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="paging" style="display:flex;justify-content: center;margin-top: 100px;"></div>
        </div>
    </div>
    <div class="global-footer">
        <div class="global-footer-header">
            <div>
                <img class="footer1" src="./static/img/footer1.png" alt="">
                <div>
                    <p>供应链直采</p>
                    <p>限定产源 质量保证</p>
                </div>
            </div>
            <div>
                <img class="footer2" src="./static/img/footer2.png" alt="">
                <div>
                    <p>海外全品类</p>
                    <p>实时物流 安全可控</p>
                </div>
            </div>
            <div>
                <img class="footer3" src="./static/img/footer3.png" alt="">
                <div>
                    <p>区块链溯源</p>
                    <p>实时物流 安全可控</p>
                </div>
            </div>
            <div>
                <img class="footer4" src="./static/img/footer4.png" alt="">
                <div>
                    <p>全过程冷链</p>
                    <p>实时物流 安全可控</p>
                </div>
            </div>
        </div>
        <div style="width: 100%;height: 1px;background-color: #ffffff;opacity: 0.38;"></div>
        <div class="global-footer-cont">
            <div>
                <a href="./index.html" class="global-footer-cont-logo">
                    <img src="./static/img/footer_logo.png" alt="">
                </a>
                <a href="" class="global-footer-cont-menu">关于我们</a>
                <a href="" class="global-footer-cont-menu">产品中心</a>
                <a href="" class="global-footer-cont-menu">服务介绍</a>
                <a href="./help.html" class="global-footer-cont-menu">购物指南</a>
                <a href="./help.html" class="global-footer-cont-menu">帮助中心</a>
            </div>
            <div>
                <img src="./static/img/footer_code.png" alt="">
                <p>扫描关注</p>
                <p>贝链嗨购官方微信</p>
            </div>
        </div>
        <div class="global-footer-explain">鲁ICP备 18098987号 copyright @2018 beilianhaigou.com.ALL Rights Reserved.
        </div>
    </div>
    <script>
        layui.use('layer', function () { //独立版的layer无需执行这一句
            var layer = layui.layer; //独立版的layer无需执行这一句
            $('#service').click(function () {
                layer.open({
                    type: 2,
                    title: '在线客服',
                    shadeClose: true,
                    shade: false,
                    maxmin: true, //开启最大化最小化按钮
                    area: ['893px', '600px'],
                    content: '//fly.layui.com/'
                });
            });
        });
        layui.use(['laypage', 'layer'], function () {
            var laypage = layui.laypage,
                layer = layui.layer;
            //完整功能
            laypage.render({
                elem: 'paging',
                count: 100,
                theme: '#f5a623',
                layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip'],
                jump: function (obj) {
                    console.log(obj)
                }
            });
        });
    </script>
</body>

</html>